<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<%@ page language="java" import="com.server.web.JsVersionUtil"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<head>
	<meta charset="UTF-8">
	<title>北京市人民政府外事办公室领事保护教育服务平台</title>
	<!-- 新 Bootstrap 核心 CSS 文件 -->
	<link rel="stylesheet" href="<c:url value='/share/bootstrap.min.css'></c:url>">
	<link rel="stylesheet" href="<c:url value='/share/AllStyle.css'></c:url>">
	<!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
	<script src="<c:url value='/js/jquery.min.js'></c:url>"></script>
	<!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
	<script src="<c:url value='/js/bootstrap.min.js'></c:url>"></script>
	<script src="<c:url value='/js/all.js'></c:url>"></script>
	<script src="<c:url value='/js/serverCommonJs.js'></c:url>"></script>
	<script src="<c:url value='/js/rqfCommon/rqfCommon.js'></c:url>"></script>
		<style>
		.table{
			width: 100%;
			table-layout: fixed;
   			max-width: 100%;
  			margin-bottom: 20px;
			background-color: transparent;
			border-spacing: 0;
    		border-collapse: collapse;
			}
		td{
			width:100%;
			word-break:keep-all;/* 不换行 */
			white-space:nowrap;/* 不换行 */
			overflow:hidden;/* 内容超出宽度时隐藏超出部分的内容 */
			text-overflow:ellipsis;/* 当对象内文本溢出时显示省略标记(...) 需与overflow:hidden;一起使用。*/
		} 
		.table>thead:first-child>tr:first-child>th {
		    font-weight: 300;
		}
		.table>thead>tr>th{
			border-bottom: 0;
		}
				
	</style>
	</head>
	<body>
		<div class="home_content Interface_center">
			<div class="input-group input-group" style="margin-top: 20px;margin-bottom: 30px;">
				<ul class="Interface_relative" id="row_Interface_relative">
					<li class="row_Interface_relative_li" value="1">国家地区形势资料</li>
					<li value="2">涉外机构信息</li>
					<li value="3">应急流程资料</li>
					<li value="4">相关专题资料</li>
				</ul>
			</div>
			<table class="table case_table">
		    	<thead style="background: #2459aa; color: #fff;border: 1px solid #337ab7;">
			        <tr>
			          <th style="width: 65px;">序列号</th>
			          <th style="padding-left: 20px;padding-right: 20px;">国家/地区</th>
			          <th >宗教信仰</th>
			          <th >政治形势</th>
			          <th >民族关系</th>
			          <th >气候条件</th>
			          <th style="padding-left: 20px;padding-right: 20px;text-align: right;">发布日期</th>
			        </tr>
			    </thead>
		      <tbody id="case_details_1">
				</tbody>
		    </table>
		    <table class="table case_table" style="display: none;">
				<thead style="background: #2459aa; color: #fff;border: 1px solid #337ab7;">
			        <tr>
			        	<th style="width: 65px;">序列号</th>
			        	<th style="padding-left: 20px;padding-right: 20px;">国别/地区</th>
			          <th>机构名称</th>
			          <th>所属区域</th>
			          <th style="padding-left: 20px;padding-right: 20px;text-align: right;">发布日期</th>
			        </tr>
			    </thead>
				<tbody id="case_details_2">
				</tbody>
			</table>
			<table class="table case_table" style="display: none; ">
				<thead style="background: #2459aa; color: #fff;border: 1px solid #337ab7;">
			        <tr>
			        	<th style="width: 65px;">序列号</th>
			        	<th style="padding-left: 20px;padding-right: 20px;">流程名称</th>
			          <th style="width: 120px;">国别/地区</th>
			          <th>流程类别</th>
			          <th style="padding-left: 20px;padding-right: 20px;text-align: right;">发布日期</th>
			        </tr>
			    </thead>
				<tbody id="case_details_3">
				</tbody>
			</table>
			<table class="table case_table" style="display: none;">
				<thead style="background: #2459aa; color: #fff;border: 1px solid #337ab7;">
			        <tr>
			          <th style="width: 65px;">序列号</th>
			          <th style="padding-left: 20px;padding-right: 20px;">专题名称</th>
			          <th>专题类别</th>
			          <th>专题概述</th>
			          <th style="padding-left: 20px;padding-right: 20px;text-align: right;">发布日期</th>
			        </tr>
			    </thead>
				<tbody id="case_details_4">
				</tbody>
			</table>
			
			<br>
			<br>
			<div id="WH-pagebar_1" class="WH-pagebar"></div>
			<div id="WH-pagebar_2" class="WH-pagebar"></div>
			<div id="WH-pagebar_3" class="WH-pagebar"></div>
			<div id="WH-pagebar_4" class="WH-pagebar"></div>
			<br>
			<br>
		</div>

		<script type="text/javascript">
			var rootPath = '${rootPath}';
			
			var home_index;//当前分页码
			var wh_count;//总页数
			var isFirst = true;
			var isFirst_1 = true;
			var isFirst_2 = true;
			var isFirst_3 = true;
			var isFirst_4 = true;
			$(function(){
				$(".WH-pagebar").hide();
				$("#WH-pagebar_1").show();
				var init_type = "";
				var this_type = "";
				//默认初始化type值
				init_type = $("#row_Interface_relative li.row_Interface_relative_li").attr("value");
				foreignPage(init_type,0);//初始化
				$(".home_header-nav li").click(function(){
					$(".home_header-nav li a").removeClass("home_header_1_ClickA");
					$(this).children().addClass("home_header_1_ClickA");
				});
				$("#row_Interface_relative li").click(function(){
					$("#row_Interface_relative li").removeClass("row_Interface_relative_li");
					$(this).addClass("row_Interface_relative_li");
					var index = $(this).index();
					var WHIndex = index + 1;
					$(".WH-pagebar").hide();
					$("#WH-pagebar_"+ WHIndex).show();
					//获取当前type值
					this_type = $(this).attr("value");
					empty();//清空所有
					foreignPage(this_type,0);
					$(".home_content>table").hide();
					$(".home_content>table:eq("+ index +")").show();
					
				});
			
				for(var i = 0 ;i<8 ;i++){
					var val= $("tbody tr").children().eq(0).html();
					$("tbody tr").eq(i).children().eq(0).attr('title',val);
				}
				
				//数据传递接收
				function foreignPage(type,home_index){
					var url = "<c:url value='/foreign/study/list/"+ type +"'></c:url>";
					var PageSize = 20;//总页码 
					$.ajax({
						url: url,
						type: 'POST',
						dataType: 'html',
						data:{
							"pageIndex" : home_index,//当前分页码
							"pageSize" : PageSize
						},
						success:function(data){
							var obj = gridDataFormat(data);
							var s_num = obj.count / PageSize;
							wh_count = obj.count;
							var Index = PageSize * home_index;
							var html = "";
							if(obj == ""){
								$("#case_details").html("");
							}
							if(type == 1){
								for(var i = 0; obj.data.length > i; i++){
									var substr = "";
									if(obj.data[i].auditTime != null){
										substr = obj.data[i].auditTime.substring(0, 10);
									}
									html += '<tr onclick="javascript:study(\''+ type +'\',\''+obj.data[i].id
									+'\')">'+
											  '<td>'+ (Index+i+1) +'</td>'+
									          '<td style="padding-left: 20px;padding-right: 20px;" title="'+ obj.data[i].country_area +'">'+ obj.data[i].country_area +'</td>'+
									          '<td title="'+ obj.data[i].faith +'">'+ obj.data[i].faith +'</td>'+
									          '<td title="'+ obj.data[i].politics +'">'+ obj.data[i].politics +'</td>'+
									          '<td title="'+ obj.data[i].nation_rla +'">'+ obj.data[i].nation_rla +'</td>'+
									          '<td title="'+ obj.data[i].climatic_cond +'">'+ obj.data[i].climatic_cond +'</td>'+
									          '<td style="padding-left: 20px;padding-right: 20px;text-align: right;" title="'+ substr +'">'+ substr +'</td>'+
									        '</tr>';
								}
							    $("#case_details_1").html(html);
							    if(isFirst_1){
									creatPageBar_1(wh_count,PageSize);
									isFirst_1 = false;
						        }
							}
							if(type == 2){
								for(var i = 0; obj.data.length > i; i++){
									var substr = "";
									if(obj.data[i].auditTime != null){
										substr = obj.data[i].auditTime.substring(0, 10);
									}
									html += '<tr onclick="javascript:study(\''+ type +'\',\''+obj.data[i].id
									+'\')">'+
											  '<td>'+ (Index+i+1) +'</td>'+
											  '<td style="padding-left: 20px;padding-right: 20px;" title="'+ obj.data[i].country_area +'">'+ obj.data[i].country_area +'</td>'+
									          '<td title="'+ obj.data[i].org_name +'">'+ obj.data[i].org_name +'</td>'+
									          '<td title="'+ obj.data[i].area_range +'">'+ obj.data[i].area_range +'</td>'+
									          '<td style="padding-left: 20px;padding-right: 20px;text-align: right;" title="'+ substr +'">'+ substr +'</td>'+
									        '</tr>';
								}
							    $("#case_details_2").html(html);
							    if(isFirst_2){
									creatPageBar_2(wh_count,PageSize);
									isFirst_2 = false;
						        }
							}
							if(type == 3){
								for(var i = 0; obj.data.length > i; i++){
									var substr = "";
									if(obj.data[i].auditTime != null){
										substr = obj.data[i].auditTime.substring(0, 10);
									}
									html += '<tr onclick="javascript:study(\''+ type +'\',\''+obj.data[i].id
									+'\')">'+
											  '<td>'+ (Index+i+1) +'</td>'+
									          '<td style="padding-left: 20px;padding-right: 20px;" title="'+ obj.data[i].name +'">'+ obj.data[i].name +'</td>'+
									          '<td title="'+ obj.data[i].country_area +'">'+ obj.data[i].country_area +'</td>'+
									          '<td title="'+ obj.data[i].class1 +'">'+ obj.data[i].class1 +'</td>'+
									          '<td style="padding-left: 20px;padding-right: 20px;text-align: right;" title="'+ substr +'">'+ substr +'</td>'+
									        '</tr>';
								}
							    $("#case_details_3").html(html);
							    if(isFirst_3){
									creatPageBar_3(wh_count,PageSize);
									isFirst_3 = false;
						        }
							}
							if(type == 4){
								for(var i = 0; obj.data.length > i; i++){
									var substr = "";
									if(obj.data[i].auditTime != null){
										substr = obj.data[i].auditTime.substring(0, 10);
									}
									html += '<tr onclick="javascript:study(\''+ type +'\',\''+obj.data[i].id
									+'\')">'+
											  '<td>'+ (Index+i+1) +'</td>'+
									          '<td style="padding-left: 20px;padding-right: 20px;" title="'+ obj.data[i].name +'">'+ obj.data[i].name +'</td>'+
									          '<td title="'+ obj.data[i].class1 +'">'+ obj.data[i].class1 +'</td>'+
									          '<td style="position: relative;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;" title="'+ obj.data[i].summarize +'">'+ obj.data[i].summarize +'</td>'+
									          '<td style="padding-left: 20px;padding-right: 20px;text-align: right;" title="'+ substr +'">'+ substr +'</td>'+
									        '</tr>';
								}
							    $("#case_details_4").html(html);
							    if(isFirst_4){
									creatPageBar_4(wh_count,PageSize);
									isFirst_4 = false;
						        }
							}
						},
						complete : function(XMLHttpRequest, textStatus) {
							/* if(isFirst){
								creatPageBar_1(wh_count,PageSize);
								creatPageBar_2(wh_count,PageSize);
								creatPageBar_3(wh_count,PageSize);
								creatPageBar_4(wh_count,PageSize);
					            isFirst = false;
					        } */
						},
						error : function() {
							//
						}
					});
				}
				
				function creatPageBar_1(count,PageSize){
					var WHPageBar = document.getElementById('WH-pagebar_1');
					var CurrentPage = 1;//起始页
					var SingleCount = Math.ceil(count/PageSize)>5?5:Math.ceil(count/PageSize);//翻页显示个数
					var PageCount = Math.ceil(count/PageSize);//总页数
					WHPageBar.innerHTML="";
					WH_Pagebar({
						id:'WH-pagebar_1', //容器ID : 必选参数
						CurrentPage:CurrentPage,   //当前页 ： 可选参数，默认值为1
						SingleCount:SingleCount,   //显示数目： 可选参数，只能为奇数，默认值为7，
						PageCount:PageCount,   //必选参数
						callback : function(pagenow,pagecount){		
							//'当前页:' + pagenow +',总共页:'+pagecount;
							$("#home_Page_video_audio_text").html("");
							foreignPage( 1, pagenow - 1);//初始化
						}
					})
				}
				
				function creatPageBar_2(count,PageSize){
					var WHPageBar = document.getElementById('WH-pagebar_2');
					var CurrentPage = 1;//起始页
					var SingleCount = Math.ceil(count/PageSize)>5?5:Math.ceil(count/PageSize);//翻页显示个数
					var PageCount = Math.ceil(count/PageSize);//总页数
					WHPageBar.innerHTML="";
					WH_Pagebar({
						id:'WH-pagebar_2', //容器ID : 必选参数
						CurrentPage:CurrentPage,   //当前页 ： 可选参数，默认值为1
						SingleCount:SingleCount,   //显示数目： 可选参数，只能为奇数，默认值为7，
						PageCount:PageCount,   //必选参数
						callback : function(pagenow,pagecount){		
							//'当前页:' + pagenow +',总共页:'+pagecount;
							$("#home_Page_video_audio_text").html("");
							foreignPage( 2, pagenow - 1);//初始化
						}
					})
				}
				
				function creatPageBar_3(count,PageSize){
					var WHPageBar = document.getElementById('WH-pagebar_3');
					var CurrentPage = 1;//起始页
					var SingleCount = Math.ceil(count/PageSize)>5?5:Math.ceil(count/PageSize);//翻页显示个数
					var PageCount = Math.ceil(count/PageSize);//总页数
					WHPageBar.innerHTML="";
					WH_Pagebar({
						id:'WH-pagebar_3', //容器ID : 必选参数
						CurrentPage:CurrentPage,   //当前页 ： 可选参数，默认值为1
						SingleCount:SingleCount,   //显示数目： 可选参数，只能为奇数，默认值为7，
						PageCount:PageCount,   //必选参数
						callback : function(pagenow,pagecount){		
							//'当前页:' + pagenow +',总共页:'+pagecount;
							$("#home_Page_video_audio_text").html("");
							foreignPage( 3, pagenow - 1);//初始化
						}
					})
				}
				
				function creatPageBar_4(count,PageSize){
					var WHPageBar = document.getElementById('WH-pagebar_4');
					var CurrentPage = 1;//起始页
					var SingleCount = Math.ceil(count/PageSize)>5?5:Math.ceil(count/PageSize);//翻页显示个数
					var PageCount = Math.ceil(count/PageSize);//总页数
					WHPageBar.innerHTML="";
					WH_Pagebar({
						id:'WH-pagebar_4', //容器ID : 必选参数
						CurrentPage:CurrentPage,   //当前页 ： 可选参数，默认值为1
						SingleCount:SingleCount,   //显示数目： 可选参数，只能为奇数，默认值为7，
						PageCount:PageCount,   //必选参数
						callback : function(pagenow,pagecount){		
							//'当前页:' + pagenow +',总共页:'+pagecount;
							$("#home_Page_video_audio_text").html("");
							foreignPage( 4, pagenow - 1);//初始化
						}
					})
				}
				
				//封装清空所有
				function empty() {
					$("#home_Page_video_audio_text").html("");//每次点击时先清空,进行加载新的列表
					$(".pagination *").remove();//每次进行筛选时,进行提前页码清空
				}
				
			});
			function study(type,id){
				window.open(rootPath+'/foreign/study/detail/'+ type +'/'+id);
			}
		</script>
	</body>
	</html>
